/**
 * webpack 打包方式 2
 *                 1 移步看：根目录下 webpack-cli.js 脚本 配合 package.json -> scripts
 * -------------------------
 */

const path = require("path");

const appDirectory = path.resolve(__filename, "../");

module.exports = {
  entry: appDirectory + "/src/js/main.js",
  output: {
    path: appDirectory + "/dist",
    filename: "bundle.js",

    //如果名字不是唯一的，需要在打包前删除上次打包结果
    //  filename: "bundle."+new Date().getTime()+".js",

    // publicPath: appDirectory +'/dist/', // 如果图片资源 和  index.html 不在一起，需要配置
  },
  module: {
    rules: [
      {

        // /\. 因为 . 是[正则表达式]特殊的含义，需要 /\转译
        // $ 标识 结尾
        test: /\.css$/, 

        // css-loader 只负责将css加载，不会生效； 
        // use: ["css-loader"]

        // https://www.webpackjs.com/loaders/#%E6%A0%B7%E5%BC%8F
        // style-loader 将 css-loader 上校
        use: ["style-loader", "css-loader"]

        //使用多个loader是， 从右向左
      },
      {
        test: /\.less$/,
        use: [{
            loader: "style-loader" // creates style nodes from JS strings
        }, {
            loader: "css-loader" // translates CSS into CommonJS
        }, {
            loader: "less-loader" // compiles Less to CSS
        }]
      },
      { //小图片 => 图片将直接以base64的形式内联在代码中，可以减少一次http请求。
        test: /\.(png|jpg|gif|jpeg)$/,
        use: [
          {
            loader: 'url-loader',
            options: {
              limit: 71,  //如果加载的图片>这个配置，会去找 file-loader
              ////fallback: 'file-loader' //默认是 这个
              name: 'images/[name]_[hash:10].[ext]', //默认 32位hash值（哈希）
                 //如果是同一张图片，那么就不会再次生成 新的图片
                 //在 home/mine 中，同名不同文件是可以的
            },
          }
        ]
      },
      { //因为图片过大，就用 file-loader
          //如果仅仅配置这个是不行，图片会md5文件名，
          //    而bundle并没有使用这个md5文件
          //so. [1] output中配置 ` publicPath: 'dist/' `
          //    [2] 或者 把 index.html 打包到 dist/ => 让图片/index 同级目录
        test: /\.(png|jpg|gif|jpeg)$/,
        use: [
          {
            loader: 'file-loader',
            options: {
              name: 'images/[name]_[hash:10].[ext]', //默认 32位hash值（哈希）
            }
          }
        ]
      }
    ]
  }
};
